import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

/**一般会在组件的计算属性（computed）获取state的数据（因为，计算属性会监控数据变化，一旦发生改变就会响应）
获取数据：this.$store.state.user.username
存储数据：this.$store.commit('change',10)，第一个参数为mutations的函数名，第二个为参数。 通过 提交(commit) 一个 mutation。
存储数据: store.dispatch('connect'); 通过 dispatch 一个 action。
*/
export default new Vuex.Store({
  //存放组件之间共享的数据
  state: {
    user: window.sessionStorage.getItem('user') == null ? null : JSON.parse(window.sessionStorage.getItem('user')),
    routes: []
  },
  //显式的更改state里的数据，mutations只能处理同步函数
  mutations: {
    initMenu(state, menus){
      state.routes = menus;
    },
    login(state, user){
      state.user = user;
      console.log("进入store, user为" + user.username);
      window.sessionStorage.setItem('user', JSON.stringify(user));
    },
    logout(state){
      console.log("注销函数, user为" + state.user.username);
      window.sessionStorage.removeItem('user');
      state.routes = [];
      state.user = null;
    }
  },
  //获取数据的方法
  getters: {            
  },
  //Actions 提交的是 mutations，而不是直接变更状态。也就是说，actions会通过mutations，让mutations帮他提交数据的变更。
  //Action 可以包含任意异步操作。ajax、setTimeout、setInterval不在话下
  actions: {    
  }
});
